{% extends "management/base.html" %}
{% block title %}登录{% endblock %}

{% block content %}

<div class="container d-flex justify-content-center align-items-center" style="min-height: 80vh;">
    <div class="col-md-6 col-sm-8">
        <!-- 错误提示 -->
        {% if state == 'wrong' %}
            <div class="alert alert-danger text-center mb-4">
                <h5>用户不存在 或 密码错误</h5>
            </div>
        {% endif %}

        <!-- 登录表单 -->
        <form method="POST" class="border rounded shadow p-4 bg-white">
            {% csrf_token %}
            <!-- ✅ 关键：给标题加 mt-3 或 mt-4，让它不要贴顶 -->
            <h2 class="text-center mb-4 mt-4">请登录</h2>

            <!-- 表单内容 -->
            <div class="mb-3">
                <label for="id_username" class="form-label">用户名</label>
                <input type="text" class="form-control" id="id_username" name="username" required autofocus>
            </div>

            <div class="mb-3">
                <label for="id_password" class="form-label">密码</label>
                <input type="password" class="form-control" id="id_password" name="password" required>
            </div>

            <button type="submit" class="btn btn-primary w-100">登录</button>

            <div class="text-center mt-3">
                <small>没有账号？<a href="{% url 'sign_up' %}">去注册</a></small>
            </div>
        </form>
    </div>
</div>

{% endblock %}